// 列隐藏按钮事件
export function hiddenColumn(index, isHide) {
  const id = 'selfColumnId' + index
  const headerColumn = document.getElementById(id)
  headerColumn.className = 'self-header-hiden-column'

  if (index === 2) {
    isHide.isHide1 = true
  } else if (index === 3) {
    isHide.isHide2 = true
  } else if (index === 4) {
    isHide.isHide3 = true
  } else if (index === 5) {
    isHide.isHide4 = true
  } else if (index === 6) {
    isHide.isHide5 = true
  } else if (index === 7) {
    isHide.isHide6 = true
  } else if (index === 8) {
    isHide.isHide7 = true
  } else if (index === 9) {
    isHide.isHide8 = true
  } else if (index === 10) {
    isHide.isHide9 = true
  } else if (index === 11) {
    isHide.isHide10 = true
  } else if (index === 12) {
    isHide.isHide11 = true
  } else if (index === 13) {
    isHide.isHide12 = true
  } else if (index === 14) {
    isHide.isHide13 = true
  } else if (index === 15) {
    isHide.isHide14 = true
  } else if (index === 16) {
    isHide.isHide15 = true
  }
  // this.isHidenNull = true

  const params = {
    isHide: isHide
  }
  return params
}
// 隐藏行
export function hideRow(tableData, row, tableHideRow, vm) {
  console.log(tableData, row, tableHideRow, vm, 'adsa')
  var tableHeader = false
  tableData.forEach((item, index) => {
    if (item.index === row.index) {
      tableData.splice(index, 1)
      if (tableData[index - 1]) {
        vm.$set(tableData[index - 1], 'isHide', true)
      } else {
        tableHeader = true
      }
      tableHideRow.push(item)
    }
  })
  return { tableHeader, tableHideRow }
}
// 一键隐藏
export function hideAll(
  multipleSelection,
  tableData,
  tableHideRow,
  columnChecked,
  isHide,
  vm
) {
  var tableHeader = false
  // 批量隐藏-行
  // console.log('批量隐藏')
  multipleSelection.forEach(item => {
    tableData.forEach((element, index) => {
      if (item.index === element.index) {
        tableData.splice(index, 1)
        if (tableData[index - 1]) {
          vm.$set(tableData[index - 1], 'isHide', true)
        } else {
          tableHeader = true
        }
        tableHideRow.push(item)
      }
    })
  })

  // var isHide1 = false, isHide2 = false, isHide3 = false, isHide4 = false, isHide5 = false, isHide6 = false, isHide7 = false, isHide8 = false
  // 批量隐藏-列
  columnChecked.forEach(item => {
    const id = 'selfColumnId' + item
    const headerColumn = document.getElementById(id)
    headerColumn.className = 'self-header-hiden-column'
    if (item === 2) {
      isHide.isHide1 = true
    } else if (item === 3) {
      isHide.isHide2 = true
    } else if (item === 4) {
      isHide.isHide3 = true
    } else if (item === 5) {
      isHide.isHide4 = true
    } else if (item === 6) {
      isHide.isHide5 = true
    } else if (item === 7) {
      isHide.isHide6 = true
    } else if (item === 8) {
      isHide.isHide7 = true
    } else if (item === 9) {
      isHide.isHide8 = true
    } else if (item === 10) {
      isHide.isHide9 = true
    } else if (item === 11) {
      isHide.isHide10 = true
    } else if (item === 12) {
      isHide.isHide11 = true
    } else if (item === 13) {
      isHide.isHide12 = true
    } else if (item === 14) {
      isHide.isHide13 = true
    } else if (item === 15) {
      isHide.isHide14 = true
    } else if (item === 16) {
      isHide.isHide15 = true
    }
  })
  var isOneorMoreSelect = false
  // this.isAnyHide()
  const params = {
    tableHeader: tableHeader,
    tableHideRow: tableHideRow,
    isOneorMoreSelect: isOneorMoreSelect,
    isHide: isHide
  }
  return params
}
// 一键恢复
export function recoverAll(num, tableData, tableHideRow, columnChecked) {
  // 展开列
  for (var index = 2; index < num; index++) {
    const id = 'selfColumnId' + index
    const headerColumn = document.getElementById(id)
    headerColumn.className = 'self-header-column'
  }
  columnChecked.forEach((item) => {
    const id = 'selfColumnId' + item
    const headerColumn = document.getElementById(id)
    headerColumn.className = 'self-header-column checked-column'
  })
  // 展开行
  tableData.forEach(item => {
    tableHideRow.forEach((e, i) => {
      if (item.index === e.index) {
        tableHideRow.splice(i, 1)
      }
    })
  })
  var tableHeader = false
  const params = {
    tableHeader: tableHeader,
    tableHideRow: tableHideRow
  }
  return params
}
// 行恢复按钮
export function recoverRow(index, tableData, tableHeader, tableHideRow, vm) {
  var nextIndex = ''
  var currentIndex = index
  if (index === '0') {
    nextIndex = tableData[0] ? tableData[0].index : '0'
  } else {
    tableData.forEach((item, i) => {
      if (item.index === index) {
        if (tableData[i + 1]) {
          nextIndex = tableData[i + 1].index
        } else {
          nextIndex = 0
        }
      }
    })
  }
  tableHideRow.forEach((item, i) => {
    if (nextIndex > 0) {
      if (
        parseInt(item.index) > currentIndex &&
                parseInt(item.index) < nextIndex
      ) {
        if (item.isHide) {
          item.isHide = false
        }
        tableData.push(item)
        if (index > 0) {
          tableData.forEach((e, i) => {
            if (e.index === index) {
              vm.$set(tableData[i], 'isHide', false)
            }
          })
        } else {
          tableHeader = false
        }
      }
    } else {
      if (parseInt(item.index) > currentIndex) {
        if (item.isHide) {
          item.isHide = false
        }
        tableData.push(item)
        if (index > 0) {
          tableData.forEach((e, i) => {
            if (e.index === index) {
              vm.$set(tableData[i], 'isHide', false)
            }
          })
        } else {
          tableHeader = false
        }
      }
    }
  })
  tableData.forEach(item => {
    tableHideRow.forEach((e, i) => {
      if (item.index === e.index) {
        tableHideRow.splice(i, 1)
      }
    })
  })
  const params = {
    tableHeader: tableHeader,
    tableHideRow: tableHideRow
  }
  return params
}
// 列恢复按钮
export function recoverColumn(index, isHide) {
  if (index === 2) {
    isHide.isHide1 = false
  } else if (index === 3) {
    isHide.isHide2 = false
  } else if (index === 4) {
    isHide.isHide3 = false
  } else if (index === 5) {
    isHide.isHide4 = false
  } else if (index === 6) {
    isHide.isHide5 = false
  } else if (index === 7) {
    isHide.isHide6 = false
  } else if (index === 8) {
    isHide.isHide7 = false
  } else if (index === 9) {
    isHide.isHide8 = false
  } else if (index === 10) {
    isHide.isHide9 = false
  } else if (index === 11) {
    isHide.isHide10 = false
  } else if (index === 12) {
    isHide.isHide11 = false
  } else if (index === 13) {
    isHide.isHide12 = false
  } else if (index === 14) {
    isHide.isHide13 = false
  } else if (index === 15) {
    isHide.isHide14 = false
  } else if (index === 16) {
    isHide.isHide15 = false
  }
  const id = 'selfColumnId' + index
  const headerColumn = document.getElementById(id)
  headerColumn.className = 'self-header-column'
  const params = {
    isHide: isHide
  }
  return params
}

// 渲染需要隐藏的表格列头部
export function render(h, column, index) {
  return h(
    'div', {
      attrs: {
        id: 'selfColumnId' + index
      },
      class: 'self-header-column',
      on: {
        mouseenter: () => this.headerMouseEnter(column, index),
        mouseleave: () => this.headerMouseLeave(column, index)
      }
    }, [
      // 多选框
      h('el-checkbox', {
        class: 'self-checkbox-header',
        on: {
          change: checked => this.changeColumnCheckbox(checked, column, index)
        }
      }),
      // 标题
      h('span', column.label),
      // 隐藏图标
      h(
        'el-tooltip', {
          props: {
            content: '隐藏',
            placement: 'top',
            effect: 'light',
            popperClass: 'hidentooltip'
          }
        }, [
          // <span><img src="@/assets/style/icons/hiden.png"/>批量隐藏</span>
          h('img', {
            class: 'el-icon-view',
            style: 'vertical-align: text-bottom',
            attrs: {
              src: require('@/assets/style/icons/hiden.png')
            },
            on: {
              click: () => this.hiddenColumn(column, index)
            },
            directives: [{
              // name: 'icon',
              title: '隐藏'
            }]
          })
        ]
      ),
      // 展开图标
      h('i', {
        class: 'el-icon-d-arrow-right',
        on: {
          click: () => this.recoverColumn(column, index)
        }
      }),
      h('span', {
        class: 'self-hiden-line',
        on: {
          click: () => this.recoverColumn(column, index)
        }
      })
    ]
  )
}
export default {
  hiddenColumn,
  hideRow,
  hideAll,
  recoverAll,
  recoverRow,
  recoverColumn,
  render
}
